<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="apple-mobile-web-app-status-bar-style" content="black">
	<meta name="format-detection" content="telephone=no">
	<title>关注和收藏</title>
</head>
<link rel="stylesheet" type="text/css" href="../styles/index.css">
<script type="text/javascript">
	(function (doc, win) {
        var docEl = doc.documentElement,
            resizeEvt = 'onorientationchange' in window ? 'onorientationchange' : 'resize',
            recalc = function () {
                var clientWidth = docEl.clientWidth;
                if (!clientWidth) return;
                if(clientWidth>=750){
                    docEl.style.fontSize = '20px';
                }else{
                    docEl.style.fontSize = 20 * (clientWidth / 750) + 'px';
                }
            };

        if (!doc.addEventListener) return;
        win.addEventListener(resizeEvt, recalc, false);
        doc.addEventListener('DOMContentLoaded', recalc, false);
    })(document, window);
</script>
<body class="wbg">
	<div class="warp">
		<section class="keepBox">
			<div class="keepTop">
				<span class="tabA active">关注</span>
				<span class="tabB">收藏</span>
			</div>
			<div class="keepInfo">

				<div class="follow">
					<ul>
						<li>
							<div class="keepTitle">
								<img src="../images/temp/logo1.jpg">
								<p class="title">陳世美</p>
								<p class="stitle">研发总监</p>
								<span class="active">+ 关注</span>
							</div>
							<div class="keepTxtle">
								任发科，网民常新居士。目前担任庸数数据研发总监，曾任职唯品会，会唐网，亚马逊和ThoughtWorks.近年主要关注和从事DevOps工具链的设计与实现。
							</div>
						</li>
						<li>
							<div class="keepTitle">
								<img src="../images/temp/logo2.jpg">
								<p class="title">謝清風</p>
								<p class="stitle">研发总监</p>
								<span>已关注</span>
							</div>
							<div class="keepTxtle">
								任发科，网民常新居士。目前担任庸数数据研发总监，曾任职唯品会，会唐网，亚马逊和ThoughtWorks.近年主要关注和从事DevOps工具链的设计与实现。
							</div>
						</li>
					</ul>
				</div>

				<div class="keep">
					<ul>
						<li>
							<div class="keepTitle">
								<img src="../images/temp/logo3.jpg">
								<p class="nTitle">劉德華</p>
							</div>
							<p class="keepName">技术人如何打造出日赚 1000+美元的赚钱利器</p>
							<div class="keepTxtle">
								任发科，网民常新居士。目前担任庸数数据研发总监，曾任职唯品会，会唐网，亚马逊和ThoughtWorks.近年主要关注和从事DevOps工具链的设计与实现。
							</div>
							<div class="keepClick">
								活动已结束
								<a href="#">阅读文章和实录 ></a>
							</div>
						</li>
						<li>
							<div class="keepTitle">
								<img src="../images/temp/logo3.jpg">
								<p class="nTitle">劉德華</p>
							</div>
							<p class="keepName">技术人如何打造出日赚 技术人如何打造出日赚技术人如何打造出日赚1000+美元的赚钱利器</p>
							<div class="keepTxtle">
								任发科，网民常新居士。目前担任庸数数据研发总监，曾任职唯品会，会唐网，亚马逊和ThoughtWorks.近年主要关注和从事DevOps工具链的设计与实现。
							</div>
							<div class="keepClick">
								活动已结束
								<a href="#">阅读文章和实录 ></a>
							</div>
						</li>
						<li>
							<div class="keepTitle">
								<img src="../images/temp/logo3.jpg">
								<p class="nTitle">劉德華</p>
							</div>
							<p class="keepName">技术人如何打造出日赚 1000+美元的赚钱利器</p>
							<div class="keepTxtle">
								任发科，网民常新居士。目前担任庸数数据研发总监，曾任职唯品会，会唐网，亚马逊和ThoughtWorks.近年主要关注和从事DevOps工具链的设计与实现。
							</div>
							<div class="keepClick">
								活动已结束
								<a href="#">阅读文章和实录 ></a>
							</div>
						</li>
						<li>
							<div class="keepTitle">
								<img src="../images/temp/logo3.jpg">
								<p class="nTitle">劉德華</p>
							</div>
							<p class="keepName">技术人如何打造出日赚 1000+美元的赚钱利器</p>
							<div class="keepTxtle">
								任发科，网民常新居士。目前担任庸数数据研发总监，曾任职唯品会，会唐网，亚马逊和ThoughtWorks.近年主要关注和从事DevOps工具链的设计与实现。
							</div>
							<div class="keepClick">
								活动已结束
								<a href="#">阅读文章和实录 ></a>
							</div>
						</li>
						<li>
							<div class="keepTitle">
								<img src="../images/temp/logo3.jpg">
								<p class="nTitle">劉德華</p>
							</div>
							<p class="keepName">技术人如何打造出日赚 1000+美元的赚钱利器</p>
							<div class="keepTxtle">
								任发科，网民常新居士。目前担任庸数数据研发总监，曾任职唯品会，会唐网，亚马逊和ThoughtWorks.近年主要关注和从事DevOps工具链的设计与实现。
							</div>
							<div class="keepClick">
								活动已结束
								<a href="#">阅读文章和实录 ></a>
							</div>
						</li>
					</ul>
				</div>
				<p class="more">没有更多内容</p>
			</div>
		</section>
		
		<footer class="footer">
			<nav class="nav">
				<ul>
					<li class="active">
						<a href="">
							<span class="navA"></span>
							<p>发现</p>
						</a>
					</li>
					<li>
						<a href="">
							<span class="navB"></span>
							<p>圈子</p>
						</a>
					</li>
					<li>
						<a href="">
							<span class="navC"></span>
							<p>阅读</p>
						</a>
					</li>
					<li>
						<a href="">
							<span class="navD"></span>
							<p>我</p>
						</a>
					</li>
				</ul>
			</nav>
		</footer>
	</div>
</body>
<script src='../js/jquery-1.9.1.js'></script>
<script type="text/javascript">
	$(function(){
		/*点击切换*/
		$('.keepTop span').click(function(){
			$(this).addClass('active').siblings().removeClass('active');
			if($(this).hasClass('tabB')){
				$('.keep').show();
				$('.follow').hide();
			}else{
				$('.follow').show();
				$('.keep').hide();
			}
		});

		/*点击关注*/
		$('.follow ul li span').click(function(){
			if($(this).hasClass('active')){
				$(this).removeClass('active').text('已关注');
			}else{
				$(this).addClass('active').text('+ 关注');
			}
		})
		
	})
</script>
</html>